$(document).ready(function() {
	layui.use('element', function() {
		var element = layui.element;

		// 一些事件监听
		element.on('tab(demo)', function(data) {
			console.log(data);
		});
	});
	// 导航栏鼠标悬浮
	$(".ul li > a").hover(
		function() {
			$(this).css("color", "red");

		},
		function() {
			$(this).css("color", "gray");
		});
	$("#login li>a").hover(

		function() {
			$(this).css("color", "red");
		},
		function() {
			$(this).css("color", "gray");
		});
	// 侧边栏鼠标悬浮
	$("#mine > img").hover(
		function() {
			$("#mine").css("background-color", "red");

		},
		function() {
			$("#mine").css("background-color", "#FFFFFF");
		});
	$("#kefu >img").hover(

		function() {
			$("#kefu").css("background-color", "red");
		},
		function() {
			$("#kefu").css("background-color", "#FFFFFF");
		});
	$("#dingdan >img").hover(

		function() {
			$("#dingdan").css("background-color", "red");
		},
		function() {
			$("#dingdan").css("background-color", "#FFFFFF");
		});
	$("#shopcar >img").hover(

		function() {
			$("#shopcar").css("background-color", "red");
		},
		function() {
			$("#shopcar").css("background-color", "#FFFFFF");
		});
		
	// 商品导航悬浮效果
	$(".classify ul li a").hover(

		function() {
			$(this).css({"background-color":"#F5F5F5","color":"black"});
		},
		function() {
			$(this).css({"background-color":"#282B33","color":"#B6BDC2"});
		});
		// 轮播图效果
	layui.use('carousel', function() {
		var carousel = layui.carousel;
		// ***************************建造实例
		var ins = carousel.render({
			elem: '#test1',
			width: '1200px' // 设置容器宽度
				,
			height: '460px',
			arrow: 'always' // 始终显示箭头，可选hover,none
				,
			anim: 'fade' // 切换动画方式，可选fade,default
				,
			full: false // 全屏
				,
			autoplay: true // 自动切换
				,
			interval: 2000 // 自动切换的时间间隔
				,
			index: 0 // 初始化时item索引,默认时0
				,
			indicator: 'inside' // 指示器位置，可选outside,none
		});

		carousel.on('change(test1)', function(obj) { // test1来源于对应HTML容器的
														// lay-filter="test1"
														// 属性值
			var x = obj.index; // 当前条目的索引
			// console.log(obj.index); //当前条目的元素对象
			if(x == 1) {
				setTimeout(function() {
					$(".left").css("background-color", "#F1B778");
					$(".right").css("background-color", "#F1B778");
					$(".content").css("background-color", "#F1B778");
				}, 150);

			} else if(x == 2) {
				setTimeout(function() {
					$(".left").css("background-color", "#DE3435");
					$(".right").css("background-color", "#DE3435");
					$(".content").css("background-color", "#DE3435");
				}, 150);

			} else if(x == 3) {
				setTimeout(function() {
					$(".left").css("background-color", "#333D1B");
					$(".right").css("background-color", "#333D1B");
					$(".content").css("background-color", "#333D1B");
				}, 150);

			} else if(x == 0) {
				setTimeout(function() {
					$(".left").css("background-color", "#2B92DD");
					$(".right").css("background-color", "#2B92DD");
					$(".content").css("background-color", "#2B92DD");
				}, 150);

			}

		});

		// ****************************重置轮播
		// var ins = carousel.render(options);
		ins.reload({
			arrow: 'hover'
		}); // 将arror从alway变成hover
	});
	// 侧边栏悬浮提示效果
	$(function() {
		$('[data-toggle="tooltip"]').tooltip()
	});
	
	//模糊查询
	$("#search").on("keyup",function(e){
		var searchContext =$(this).val();
		
			if(searchContext != null && searchContext != ""){
						//发送ajax请求
						//$.post(url, [data], [callback], [type]) 
						
						if(searchContext.trim().length>0){
							$.post(
									"http://localhost:1805/index/search",
									{"context":searchContext},
									function(data){	//data为响应回来的数据
//										alert(searchContext);
										$("#search-div").css("display","block");
										
										$("#search-div").empty();
										
										//把data数据添加到div中
										$.each(data,function(i,obj){
											$item = $("<a class='search_a' href='/classify/showclassify?keyname=" +
													obj+"'><p>"+obj+"</p></a>");						
											$("#search-div").append($item );
										});
						
										
										
									},
									"json"
								);
						}
						
			}else{
						//没有输入内容
						//div隐藏
						$("#search-div").css("display","none");
					
			}
			
			
			
            //查看回车的键盘号，13
            if(e.keyCode==13){
            	//如果用户按下回车键
            	if(searchContext != null && searchContext != ""){
            		if(searchContext.trim().length>0){
//            			alert(searchContext);
            			//输入框不为空
            			
            			$.post(
            					//发送ajax请求
								"http://localhost:1805/index/search",
								{"context":searchContext},
								function(data){	//data为响应回来的数据
//									alert(data);
									$("#main_3").css("display","block");
									
									
									//把data数据添加到div中
									$.each(data,function(i,obj){	
										$item = $("<div><div class='item_serchmovie' style='height:210px;'>"+
										"<div class='movie_img'  style='background: url("+obj.m_img+");height: 200px;background-size: 100%; width: 15%; float: left;position: relative;background-repeat:no-repeat;'></div>"+	
										
										"<div style='width: 80%;float: left; height: auto;text-align:center;margin-left:5%;position: relative;'>"+
											"<strong style='margin-left: 10px;float:left;font-size:30px;'>"+obj.m_name+"</strong>"+
											"<div class='clear'></div>"+
											"<h5 style='margin-left: 10px;float:left;'>导演："+obj.m_director+"</h5>"+
											"<h5 style='margin-left: 10px;float:left;'>地区："+obj.m_country+"</h5>"+
											"<h5 style='margin-left: 10px;float:left;'>主演："+obj.a_name+"</h5>"+
											"<h5 style='margin-left: 10px; line-height: 30px;float:left;text-align:left;'>"+
											obj.m_intro+"<a href='${path}/detail?m_id="+obj.m_id+"&a_id="+obj.a_id+"' style='color:blue'>更多详情</a</h5>"+"</div></div></div>");
										var oBox=$item;
										
										var val=searchContext;
										var oContent=oBox.html();
										var findText=oContent.split(val);
										oBox.innerHTML=findText.join("<font style='color:red'>"+val+"</font>");
										
										$(".main_3").append(oBox.innerHTML );
									
									});	
									
								},
								"json"
								
							);
            		}
            	}
            	
            } 

		});
});